.vp-tag {
  --vp-tag-color: var(--el-color-primary);
  --vp-tag-border-color: var(--el-color-primary);

  display: inline-block;
  padding: 0 7px;
  border-radius: 10px;
  border: 1px solid var(--vp-tag-border-color);
  font-size: var(--el-font-size-extra-small);
  color: var(--vp-tag-color);
  line-height: 18px;
  white-space: nowrap;

  &.beta {
    --vp-tag-color: var(--el-color-danger);
    --vp-tag-border-color: var(--el-color-danger);
  }
  &.deprecated {
    --vp-tag-color: var(--el-color-warning);
    --vp-tag-border-color: var(--el-color-warning);
  }
  &.a11y {
    --vp-tag-color: var(--purple-color);
    --vp-tag-border-color: var(--purple-color-light);
  }
  &.required {
    --vp-tag-color: var(--el-color-success);
    --vp-tag-border-color: var(--el-color-success);
  }
}
